<template>
	<view>

		<view class="title_layout">
			<!-- 服务态度 -->
			<view class="row" style="margin-top: 20px;">
				<text class="text-1">服务态度</text>
				<view style="display: flex;flex-direction: row;align-items: center;">
					<block>
						<image v-if="serviceAttitude>=1" class="star-icon" @click="serviceAttitudeChoose(1)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceAttitudeChoose(1)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceAttitude>=2" class="star-icon" @click="serviceAttitudeChoose(2)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceAttitudeChoose(2)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceAttitude>=3" class="star-icon" @click="serviceAttitudeChoose(3)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceAttitudeChoose(3)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceAttitude>=4" class="star-icon" @click="serviceAttitudeChoose(4)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceAttitudeChoose(4)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceAttitude>=5" class="star-icon" @click="serviceAttitudeChoose(5)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceAttitudeChoose(5)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>
				</view>
			</view>

			<!-- 保养技术 -->
			<view class="row">
				<text class="text-1">保养技术</text>
				<view style="display: flex;flex-direction: row;align-items: center;">
					<block>
						<image v-if="maintenanceTechnology>=1" class="star-icon" @click="maintenanceTechnologyChoose(1)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="maintenanceTechnologyChoose(1)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="maintenanceTechnology>=2" class="star-icon" @click="maintenanceTechnologyChoose(2)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="maintenanceTechnologyChoose(2)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="maintenanceTechnology>=3" class="star-icon" @click="maintenanceTechnologyChoose(3)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="maintenanceTechnologyChoose(3)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="maintenanceTechnology>=4" class="star-icon" @click="maintenanceTechnologyChoose(4)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="maintenanceTechnologyChoose(4)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="maintenanceTechnology>=5" class="star-icon" @click="maintenanceTechnologyChoose(5)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="maintenanceTechnologyChoose(5)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>
				</view>
			</view>

			<!-- 服务效率 -->
			<view class="row">
				<text class="text-1">服务效率</text>
				<view style="display: flex;flex-direction: row;align-items: center;">
					<block>
						<image v-if="serviceEfficiency>=1" class="star-icon" @click="serviceEfficiencyChoose(1)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceEfficiencyChoose(1)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceEfficiency>=2" class="star-icon" @click="serviceEfficiencyChoose(2)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceEfficiencyChoose(2)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceEfficiency>=3" class="star-icon" @click="serviceEfficiencyChoose(3)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceEfficiencyChoose(3)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceEfficiency>=4" class="star-icon" @click="serviceEfficiencyChoose(4)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceEfficiencyChoose(4)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="serviceEfficiency>=5" class="star-icon" @click="serviceEfficiencyChoose(5)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="serviceEfficiencyChoose(5)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>
				</view>
			</view>

			<!-- 店面形象 -->
			<view class="row">
				<text class="text-1">店面形象</text>
				<view style="display: flex;flex-direction: row;align-items: center;">
					<block>
						<image v-if="storeImage>=1" class="star-icon" @click="storeImageChoose(1)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="storeImageChoose(1)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="storeImage>=2" class="star-icon" @click="storeImageChoose(2)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="storeImageChoose(2)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="storeImage>=3" class="star-icon" @click="storeImageChoose(3)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="storeImageChoose(3)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="storeImage>=4" class="star-icon" @click="storeImageChoose(4)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="storeImageChoose(4)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>

					<block>
						<image v-if="storeImage>=5" class="star-icon" @click="storeImageChoose(5)"
							src="@appstatic/my/my_maintain_star_alight.png" />
						<image v-else class="star-icon" @click="storeImageChoose(5)"
							src="@appstatic/my/my_maintain_star_unlit.png" />
					</block>
				</view>
			</view>

			<view class="row text-1">
				评价详情
			</view>
			<view class="border-row">
				<textarea class="uni-text" type="text" v-model='describe' value='describe' data-type='describe'
					maxlength="1500" @input='inputValueChange' placeholder="请输入评价详情" placeholder-style="color:#ADB0AE"
					auto-height />
			</view>
		</view>


		<view class="operation-view">
			<view class="cancelBtn" @click="cancelBtn">取消
			</view>
			<view class="evaluateBtn" @click="saveBtn">保存</view>
		</view>


	</view>
</template>

<script>
	const app = getApp();
	const util = require('@/utils/util.js');
	const network = require('@/manager/network-manager.js');
	export default {
		data() {
			return {
				serviceAttitude: '0',
				maintenanceTechnology: '0',
				serviceEfficiency: '0',
				storeImage: '0',
				describe: ''
			}
		},

		onLoad: function(options) {
			// this.getTestDrive(options.id)
		},
		methods: {
			//服务态度评价得分
			serviceAttitudeChoose: function(score) {
				this.serviceAttitude = score
			},
			//保养技术评价得分
			maintenanceTechnologyChoose: function(score) {
				this.maintenanceTechnology = score
			},
			//服务效率评价得分
			serviceEfficiencyChoose: function(score) {
				this.serviceEfficiency = score
			},
			//店面形象评价得分
			storeImageChoose: function(score) {
				this.storeImage = score
			},
			//取消
			cancelBtn: function() {
				this.serviceAttitude = '0'
				this.maintenanceTechnology = '0'
				this.serviceEfficiency = '0'
				this.storeImage = '0'
				this.describe = ''
			},
			//保存
			saveBtn: function() {}


		}
	}
</script>

<style>
	@import "./myMaintainEvaluate.css";
</style>
